<template>
  <div class="getResumeWrap">
    <div :hidden="hasContent" class="nofind">
      <p>暂时没有记录哦</p>
    </div>
    <div v-for="(item, index) in resumeList" :key="index" :hidden="!hasContent">
      <el-card shadow="hover" class="receiveBox">
        <div class="flex">
          <div style="width: 450px">
            <p class="receiveInfo" style="margin: 10px 0px 0px 12px">{{item.userName}}</p>
          </div>
          <div>
            <p class="receive">{{item.createTime}}</p>
            <p class="receive" :style="getStatusStyle(item.status)">
              申请状态：{{getStatusText(item.status)}}
            </p>
          </div>
        </div>
      </el-card>
    </div>
  </div>
</template>

<script>
import store from "@/store";

export default {
  data() {
    return {
      resumeList: [],
      hasContent: true,
      loginInfo: store.state
    }
  },
  mounted() {
    this.getResumeList()
  },
  methods: {
    getResumeList() {
      this.$axios.get("/jobseekerJobRelation/list/ByJobseekerJobRelation").then(res => {
        if (res.code == 200) {
          if (res.data.length == 0) {
            this.hasContent = false;
          } else {
            this.resumeList = res.data
          }
        }
      })
    },
    getStatusText(status) {
      const statusMap = {
        1: '已提交',
        2: '待沟通',
        3: '不合适',
        4: '已录用'
      }
      return statusMap[status] || '未知状态'
    },
    getStatusStyle(status) {
      // 可以根据不同状态返回不同的样式
      const colorMap = {
        1: '#409EFF', // 蓝色 - 已提交
        2: '#E6A23C', // 黄色 - 待沟通
        3: '#F56C6C', // 红色 - 不合适
        4: '#67C23A'  // 绿色 - 已录用
      }
      return {
        color: colorMap[status] || '#909399'
      }
    }
  }
}
</script>

<style>
.getResumeWrap {
  height: 1000px;
  overflow: scroll;
}

.getResumeWrap::-webkit-scrollbar {
  display: none;
}

.flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.receiveInfo {
  font-size: 16px;
  font-weight: bold;
}

.receive {
  margin: 5px 0;
}

.receiveBox {
  margin-bottom: 14px;
  width: 100%;
}

.nofind p {
  font-size: 18px;
  color: #909399;
  text-align: center;
  margin-top: 20px;
}
</style>
